<template>
  <div>
    <Card dis-hover title="查看关联商品详情">
      <Row
        type="flex"
        style="
          flex-wrap: wrap;
          width: 900px;
          margin-bottom: 16px;
          position: relative;
        "
      >
        <Col class="colclass">品牌名称： {{ dataList.main.brandName }}</Col>
        <!-- <Col class="colclass">品牌的系列：{{ dataList.main.brandseries }}</Col>
                <Col class="colclass">品类路径： {{ dataList.main.categoryPath }}</Col> -->
        <Col class="colclass">创建人： {{ dataList.main.createOper }}</Col>
        <Col class="colclass">创建时间： {{ dataList.main.createOpeTime }}</Col>
        <Col class="colclass"
          >数据标识： {{ dataList.main.delFlag == "1" ? "有效" : "无效" }}</Col
        >
        <Col class="colclass">助记码： {{ dataList.main.helpCode }}</Col>
        <Col class="colclass"
          >是否采购多计量：
          {{ dataList.main.isPurchaseMultiUnit == "1" ? "是" : "不是" }}</Col
        >
        <Col class="colclass"
          >是否销售多计量：
          {{ dataList.main.isSaleMultiUnit == "1" ? "是" : "不是" }}</Col
        >
        <Col class="colclass"
          >新增状态：
          {{
            dataList.main.productAddState == "PREPARING" ? "待准入" : "完成"
          }}</Col
        >
        <Col class="colclass"
          >新增状态显示值： {{ dataList.main.productAddStateStr }}</Col
        >
        <Col class="colclass">名称： {{ dataList.main.productName }}</Col>
        <Col class="colclass"
          >最终商品名称： {{ dataList.main.productNameFinal }}</Col
        >
        <Col class="colclass"
          >商品类型： {{ dataList.main.productTypeStr }}</Col
        >
        <Col class="colclass">销售属性： {{ dataList.main.saleAttrInfo }}</Col>
        <!-- <Col class="colclass">下属SKU数： {{ dataList.main.skuCount }}</Col> -->
        <Col class="colclass">SPU编号： {{ dataList.main.spuNo }}</Col>
        <Col class="colclass">副标题： {{ dataList.main.subtitle }}</Col>
        <!-- <Col class="colclass">模板名称： {{ dataList.main.templateName }}</Col> -->
      </Row>
      <div class="tableTitle">资质类型</div>
      <Table border :columns="columns1" :data="dataList.quaList" />
      <div class="tableTitle">sku信息</div>
      <Table border :columns="columns2" :data="dataList.skuList" />
      <div class="tableTitle">验收标准、事项列表</div>
      <Table border :columns="columns3" :data="dataList.standardList" />
      <Row type="flex" justify="center" style="flex-wrap: wrap; margin: 16px">
        <Button @click="goBack">返回</Button>
      </Row>
    </Card>
  </div>
</template>

<script>
import { ApiRequest } from '@api/basePage';
export default {
  components: {},
  data () {
    return {
      columns1: [
        {
          title: '品牌名称',
          key: 'brandName'
        },
        {
          title: '品类路径',
          key: 'categoryPath'
        },
        {
          title: '商品名称',
          key: 'productName'
        },
        {
          title: '资质类型名称',
          key: 'qualificationTypeName'
        },
        {
          title: '资质类型编号',
          key: 'qualificationTypeNo'
        },
        {
          title: 'SKU编号',
          key: 'skuNo'
        },
        {
          title: 'SPU编号',
          key: 'spuNo'
        }
      ],
      columns2: [
        {
          title: '品牌名称',
          key: 'brandName'
        },
        {
          title: '创建时间',
          key: 'createOpeTime'
        },
        {
          title: '创建人',
          key: 'createOper'
        },
        {
          title: '商品名称',
          key: 'productName'
        },
        {
          title: 'SKU名称',
          key: 'skuName'
        },
        {
          title: 'SKU编号',
          key: 'skuNo'
        },
        {
          title: 'SKU规格',
          key: 'specDetailStr'
        }
      ],
      columns3: [
        {
          title: '验收次数原值',
          key: 'checkCount'
        },
        {
          title: '验收事项名称',
          key: 'checkItemName'
        },
        {
          title: '验收方法原值',
          key: 'checkMethod'
        },
        {
          title: '创建时间',
          key: 'createOpeTime'
        },
        {
          title: '创建人',
          key: 'createOper'
        },
        {
          title: '下差原值',
          key: 'downDiffValue'
        },
        {
          title: '标准值原值',
          key: 'standardValue'
        },
        {
          title: '上差原值',
          key: 'upDiffValue'
        }
      ],
      data1: [
        {
          name: 'John Brown',
          age: 18,
          address: 'New York No. 1 Lake Park',
          date: '2016-10-03'
        }
      ],
      dataList: []
    };
  },
  mounted () {},
  created () {
    this.getInfo();
  },
  methods: {
    getInfo () {
      let uuids = this.$route.query.uuid;
      let data = {
        productKey: uuids
      };
      ApiRequest(
        '/sysback/finish/sku/list/getProductWholeInfo',
        'post',
        data,
        true
      ).then((res) => {
        if (res.retData) {
          this.dataList = res.retData;
        }
      });
    },
    goBack () {
      this.$router.go(-1);
    }
  }
};
</script>

<style lang="less" scoped>
.colclass {
  height: 30px;
  line-height: 30px;
  margin-right: 80px;
}

.absoluteBtn {
  position: absolute;
  top: 0;
  right: -150px;
}

.tableTitle {
  height: 50px;
  line-height: 50px;
  font-size: 20px;
  font-weight: bold;
}
</style>
